<template>
  <div>
    <ComDialog
      @EventClose="closeFn"
      :dialogVisible="dialogVisible"
      title="新增问金消耗"
    >
      <el-form
        :rules="EditFormRules"
        label-width="50px"
        ref="Form"
        :model="FormData"
      >
        <template>
          <el-form-item label="金额" prop="type">
            <el-select @change="getLabelFn" v-model="FormData.type">
              <el-option
                v-for="(item, index) in options"
                :key="index"
                :label="item.label"
                :value="item.value"
              ></el-option>
            </el-select>
          </el-form-item>
        </template>
        <template>
          <el-form-item label="金额" prop="value">
            <el-input v-model.number="FormData.value"></el-input>
          </el-form-item>
        </template>
      </el-form>
      <template #footer>
        <el-button @click="closeFn">取消</el-button>
        <el-button type="primary" @click="saveFn">保存</el-button>
      </template>
    </ComDialog>
  </div>
</template>

<script>
import { getConfigAddVoucherApi } from "@/wss/api/financial/pricing/listVoucher.js";
import ComDialog from "../../../../components/comDialog.vue";
export default {
  components: { ComDialog },
  props: {
    dialogVisible: {
      type: Boolean,
      default: false,
    },
  },
  data() {
    return {
      options: [
        { label: "VIP问金消费设置", value: "VOUCHER_PAY" },
        { label: "文档下载", value: "v_down_doc" },
        { label: "图文咨询", value: "v_text_consult" },
        { label: "在线咨询", value: "v_online_consult" },
        { value: "v_phone_consult", label: "电话咨询" },
        { value: "v_scene_consult", label: "现场咨询" },
        { value: "v_contract_check", label: "合同审核" },
        { value: "v_contract_write", label: "合同起草" },
      ],
      FormData: {
        value: "",
        type: "",
        name: "",
      },
      EditFormRules: {
        value: [
          {
            type: "number",
            message: "无效",
            trigger: "blur",
          },
        ],
      },
    };
  },
  methods: {
    //   获取用户选择的消耗设定
    getLabelFn(val) {
      this.options.forEach((item) => {
        if (item.value === val) {
          this.FormData.type = item.value;
          this.FormData.name = item.label;
        }
      });
    },
    //保存按钮
    async saveFn() {
      let { code, msg } = await getConfigAddVoucherApi([this.FormData]);
      if (code == 200) {
        this.$emit("update:dialogVisible", false).$emit("EventgetList");
        this.$modal.msgSuccess(msg);
        // 清空formdata表单
        this.FormData = {
          value: "",
          type: "",
          name: "",
        };
      }
    },
    // 取消
    closeFn() {
      this.$emit("update:dialogVisible", false);
    },
  },
};
</script>

<style>
</style>